<template>
	<view>
		<u-navbar title="計時" placeholder autoBack>
			<view class="flexright xiaohui" slot="right" @click="jumpurl('/pages/workbench/tianjiacdb')">添加</view>
		</u-navbar>
		<view class="mainpadding2">
			<view class="mainpadding_top ffffff radius dingwei" v-for="item in list.data" :key="item.id" @click="checkItem(item)">
				<view class="checkfocus" v-if="item.ischeck">
					<u-icon name="checkbox-mark" color="#fff" size="16"></u-icon>
				</view>
				<view class="titletext hei_text bold">{{item.name}}</view>
				<view class="flexleft flex-wrap pdl ">
					<view class="xiaohui margin_top margin_right" v-for="ite in item.cdbjhsf_data_text" :key="ite.id">{{ite.cdbjhsf.name}}：${{ite.price}}</view>
				</view>
				<view class="flexbetween margin_top">
					<view class="xiaohuang">服務費：{{item.fwf_rate}}%</view>
					<view class="flexright">
						<view class="flexleft margin_right"
							@click.stop="jumpurldetail('/pages/workbench/tianjiacdb?id=',item.id)">
							<u-icon name="edit-pen" color="#999" size="16"></u-icon>
							<view class="xiaohei">編輯</view>
						</view>
						<view class="flexleft" @click.stop="remove(item.id)">
							<u-icon name="trash" color="#999" size="16"></u-icon>
							<view class="xiaohei">刪除</view>
						</view>
					</view>
				</view>

			</view>
		</view>
		<u-modal :show="show" showCancelButton confirmColor="#ffb800" @cancel="show=false" @confirm="confirm"
			confirmText="確認" cancelText="取消">
			<view class="slot-content color_ling text_weight text">
				您確定要刪除當前套餐嗎？
			</view>
		</u-modal>
		<view class="posibottom mainpadding" v-if="type==1">
			<view class="submitbtn" @click="submit">確定</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				id: "",
				show: false,
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				type: 0,//1商品編輯進入的這個頁面，2添加計時客戶信息進入的這個頁面
				cdbtc_ids: []
			}
		},
		onLoad(options) {
			if (options.type) {
				this.type = options.type
			}
			if (options.cdbtc_ids) {
				this.cdbtc_ids = options.cdbtc_ids.split(',')
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			submit(){
				let arr = []
				this.list.data.forEach(item=>{
					if(item.ischeck){
						arr.push(item.id)
					}
				})
				uni.$emit("checkcdbtc",arr.join())
				uni.navigateBack(1)
			},
			checkItem(item){
				if(this.type==1){
					item.ischeck = !item.ischeck
				}
				if(this.type==2){
					uni.$emit("checkitemcdb",item)
					uni.navigateBack(1)
				}
			},
			init(isPage, page) {
				let _this = this
				httpRequest.request('/api/cdb/cdbtcIndex', 'GET', {
					page: page || 1,
					limit: 12,
					shop_id: uni.getStorageSync("shop_id"),
				}).then(res => {
					uni.stopPullDownRefresh()
					if (res.code == 1) {
						let resList = res.data;
						let dataList = _this.list;
						if(this.type==1){
							res.data.data.forEach(item => {
								this.$set(item,"ischeck",false)
								this.cdbtc_ids.forEach(current => {
									if (current == item.id) {
										item.ischeck = true
									}
								})
								
							})
						}
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
			async confirm() {
				let _this = this
				let res = await this.http.request('/api/cdb/delCdbtc', 'POST', {
					id: this.id
				})
				this.http.toast(res.msg)
				if (res.code == 1) {
					let index = this.list.data.findIndex(item => {
						return this.id == item.id
					})
					this.list.data.splice(index, 1)
				}
				this.show = false
			},
			remove(id) {
				this.id = id
				this.show = true
			},
			jumpurl(url) {
				uni.navigateTo({
					url
				})
			},
			jumpurldetail(url, id) {
				uni.navigateTo({
					url: url + id
				})
			},
		}
	}
</script>

<style>

</style>